<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="page/breastmilk/css/breastmilkSetList.css" />
</head>
<body>
    <div id="root" class="wrapper">
        <div class="title">备乳录入</div>
        <div class="ctrl">
            <el-row>
                <el-col :span="6">
                    <span class="key">患者姓名</span>
                    <el-input v-model="search.name" size="small" style="width: calc(100% - 100px)" placeholder="请输入姓名" />
                </el-col>
                <el-col :span="6">
                    <span class="key">联系方式</span>
                    <el-input v-model="search.phone" size="small" style="width: calc(100% - 100px)" placeholder="请输入姓名" />
                </el-col>
                <el-col :span="6">
                    <span class="key">患者状态</span>
                    <el-select v-model="search.status" size="small">
                        <el-option label="在院" value="在院"></el-option>
                        <el-option label="出院" value="出院"></el-option>
                        <el-option label="转到其他病区" value="转到其他病区"></el-option>
                    </el-select>
                </el-col>
                <el-col :span="3">
                    <el-button type="primary" size="small" @click="handleSearch" :loading="search.loading">搜索</el-button>
                </el-col>
            </el-row>
        </div>
        <div class="content" style="margin-top: 20px">
            <el-table :data="table.data" ref="data" v-loading="table.loading" border element-loading-text="加载中...">
                <el-table-column label="序号" align="center" prop="No" width="50px"></el-table-column>
                <el-table-column label="宝宝姓名" align="center" prop="name"></el-table-column>
                <el-table-column label="性别" align="center" prop="gender">
                    <template slot-scope="scope">
                        {{ scope.row.gender == 'N' ? '男' : '女' }}
                    </template>
                </el-table-column>
                <el-table-column label="出生日期" align="center" prop="birthday"></el-table-column>
                <el-table-column label="联系电话" align="center" prop="phone"></el-table-column>
                <el-table-column label="患者状态" align="center" prop="status"></el-table-column>
                <el-table-column label="床号" align="center" prop="hospitalBedNo"></el-table-column>
                <el-table-column label="操作" align="center" prop="hospitalBedNo">
                    <template slot-scope="scope">
                        <el-button style="color: #119BA9;" size="mini" @click="handleShowDialog(scope.row)">设置待备乳量</el-button>
                    </template>
                </el-table-column>
            </el-tabel>
        </div>
        
        <div class="footer">
            <el-pagination
                background
                @current-change="handleChangePage"
                :page-size="table.size"
                layout="prev, pager, next, total"
                :total="table.total">
        </div>
        <el-dialog
            title="设置待备乳量"
            :visible.sync="dialog.show"
            width="35%"
            >
            <el-form label-width="120px" v-model="dialog.form">
                <el-form-item label="待备乳量（ml）">
                    <el-input size="small" v-model="dialog.form.milkQuantity" placeholder="请输入待备乳量"></el-input>
                </el-form-item>
                <el-form-item label="备注">
                    <el-input size="small" v-model="dialog.form.remark" placeholder="请输入备注"></el-input>
                </el-form-item>
            </el-form>
            <span slot="footer" class="dialog-footer">
                <el-button @click="handleCancel" size="small">取 消</el-button>
                <el-button type="primary" @click="handleSubmit" size="small" :loading="dialog.loading">确 定</el-button>
            </span>
        </el-dialog>
    </div>
</body>
<script>
require([
    'bm/breastmilkSetList',
], function ($event) {
    $event.init()
})
</script>
</html>